<template>
	<view class="flex flex-column p-2">
		<template v-if="postList.length===0">
			<view class="text-muted font-md">搜索历史</view>
			<view class="flex align-center flex-wrap mt-2">
				<view class="history-item rounded border px-2  mx-1 my-1" hover-class="bg-light"
					v-for="(item,index) in historyList" :key="index" @click="onHistoryClick(item)">
					<text>{{item}}</text>
				</view>
			</view>
		</template>
		<template v-else>
			<scroll-view scroll-y="true">
				<block v-for="(item,index) in postList" :key="index">
					<post-item :item="item" :index="index" @onFollow="onFollow"></post-item>
				</block>
			</scroll-view>
		</template>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				type:'',
				searchVal:'',
				pageNum:1,
				historyList: [],
				postList: []
			};
		},
		onLoad(options) {
			console.log('options',options)
			const type =  options.type;
			this.type = type;
			let typeText = '';
			switch (type){
				case 'moment':
				typeText =  '话题'
					break;
				case 'post':
				typeText =  '文章'
					break;
				default:
					break;
			}
			// 修改搜索占位
			// #ifdef APP-PLUS
			let currentWebview = this.$mp.page.$getAppWebview();
			let tn = currentWebview.getStyle().titleNView; 
			console.log('tn',tn)
			// tn.searchInput.placeholder = '搜索'+typeText; 
			// currentWebview.setStyle({
			// 	titleNView: tn  
			// })
			// #endif
			// 取出搜索历史
			let list = uni.getStorageSync('historyData')
			if(list) {
				this.historyList = JSON.parse(list);
			}
		},
		// 监听原生标题栏输入变化
		onNavigationBarSearchInputChanged(e) {
			this.searchVal = e.text;
		},
		// 监听原生标题栏按钮点击
		onNavigationBarButtonTap(e) {
			if(e.index === 0) {
				this.searchEvent()
			}
		},
		
		methods: {
			onHistoryClick(item) {
				this.searchVal = item;
				this.searchEvent();
			},
			searchEvent() {
				uni.hideKeyboard();
				if(this.searchVal === '') return;
				// 去重：如果已存在则先移除
				const existIndex = this.historyList.indexOf(this.searchVal);
				if(existIndex !== -1) {
					this.historyList.splice(existIndex, 1);
				}
				// 添加到最前面
				this.historyList.unshift(this.searchVal);
				// 限制历史记录数量，最多保存10条
				if(this.historyList.length > 10) {
					this.historyList = this.historyList.slice(0, 10);
				}
				uni.setStorageSync('historyData',JSON.stringify(this.historyList))
				this.getList()
			},
			getList() {
				uni.showLoading({
					title: '加载中...',
					mask: false
				});
				const data = {
					keyword:this.searchVal,
					page:this.pageNum
				}
				this.$H.post('/search/post',data).then(res=> {
					uni.hideLoading();
					let list = []
					if(res.list && res.list.length>0) {
						list = res.list.map(v=>{
							return this.$U.formatCommonList(v)
						})
					}else {
						list = []
					}
					this.postList = list;
				})
			},
			// 关注
			onFollow(postItem,index) {
				this.postList.forEach(v=> {
					if(v.user_id === postItem.user_id){
						postItem.isFollow = true
					}
				})
				uni.showToast({
					title: '关注成功'
				});
			}
		}
	}
</script>

<style lang="scss">

</style>